<template>
	<uv-tabbar :value="currentTab" @change="changeTab">
		<template v-for="(tab, tIndex) in tabOptions" :key="tIndex">
			<uv-tabbar-item :text="tab.title" :icon="currentTab == tIndex ? tab.icon + '-fill' : tab.icon"></uv-tabbar-item>
		</template>
	</uv-tabbar>
</template>
<script lang="ts" setup>
import { ref, computed } from 'vue';
import useAppStore from '@/store/app';

const appStore = useAppStore();

var currentTab = computed(() => appStore.currentTab);

var tabOptions = [
	{ title: '统计', icon: 'home' },
	{ title: '事件', icon: 'file-text' },
	{ title: '配置', icon: 'setting' }
];

function changeTab(index: number) {
	appStore.currentTab = index;
}
</script>
